<template>
	<!--<div>-->
		<!--顶部导航-->
	  	<!--<top-nav title="首页" isTitle='none' >
	  		<top-bar slot='home' @routerChange="routerChange" >
	  		</top-bar>
	  	</top-nav>-->
	<!--</div>-->
	  	
  	<div>
  		<!--头部-->
	  	<div class="nav">
		  	<div class="wrap">
				<div class="cricle-item" @click="change(currentCricle.circle_circleId)" :id="currentCricle.circle_circleId">
					<img :src="currentCricle.collect == 1 ? startAct:startDef" />
					<span>{{currentCricle.cate_name}}</span>
				</div>
				<div class="router-item">
					<div :class="['item',{action:isHomeHome == true}]" @click="onHomeHome">首页</div>
					<div :class="['item',{action:isHomeAntonym == true}]" @click="onHomeAuton">实名</div>
					<div :class="['item',{action:isHomeAntonymity == true}]" @click="onHomeAntonymity">匿名</div>
				</div>   
				<div class="select-item">	
					<img :class="isSearch==false? 'default' : 'action'" @click="filtCricle" src="../../assets/images/home/sendmsg.png"/>
				</div>
			</div>
		</div>
		<!-----------------------------首页内容----------------------------------------------->
		<div class="home_home" >
				<div style="padding-top:65px;" v-if="isHomeHome">
					<van-pull-refresh v-model="isLoading" @refresh="onRefresh">
						<div class="home">
							<div class="home-title">
								<h3>精品贴</h3>
								<span @click="onBoutique">更多>></span>
							</div>
							<div class="list-height" v-if="isFocus">
								<home-list @maskEfocus="maskEfocus" :fineData="fineData"></home-list>
							</div>
							<div class="list-img-pic" v-else>
								<nocontent></nocontent>
							</div>
						</div>
						<div>
							<notice-page></notice-page>
						</div>
						<div class="home home-bottom">
							<div class="home-title">
								<h3 class="color">新帖</h3>
							</div>
							<home-list @maskEfocus="maskEfocus" :newPostData="newPostData" v-if="isPosts"></home-list>
							<div class="list-img-pic" v-else>
								<nocontent></nocontent>
							</div>
						</div>
					</van-pull-refresh>
				</div>
				
				<!---------------------实名内容----------------------------------->
				 <!--class="home_autonym"-->
				<div class="antonym" style="padding-top: 65px" v-if="isHomeAntonym">
					<!--<van-pull-refresh v-model="isLoading" @refresh="onRefresh" >-->
						<van-tabs v-model="active" @click="onTabs" v-if="isRealname">
						  <van-tab v-for="item in arrTab" :title="item.cate_name" :key="item.cate_id">
						  		<div class="moderator">
							    	<div class="modera-name" v-if="active!=0">
							    		<img :src="realnameData[0].user.user_himg ? realnameData[0].user.user_himg :defalut"/>
							    		<p>版主<span>{{realnameData[0].user.user_nickname}}</span></p>
							    	</div>
							   </div>
							   <div class="home-content">
							    	<div class="notice">
							    		<p v-for="item in noticeData" :id="item.announcement_id"><span>公告</span>【{{item.announcement_title}}】{{item.announcement_desc}}</p>
							    	</div>    	
							   </div>
						    	<div class="home-content" v-if="isNmemeda">
						    		<home-list @maskEfocus="maskEfocus" :realnameData="realnameData"></home-list>
						    	</div>
						    	<div class="list-img-pic" v-else>
									<nocontent></nocontent>
								</div>
						  </van-tab>
						</van-tabs>
						<div class="list-img-pic" v-else>
							<nocontent></nocontent>
						</div>
					<!--</van-pull-refresh>-->
				</div>
				<!-------------------------匿名----------------------------------------------->
				 <!--class="home_autonymity"-->
				<div v-if="isHomeAntonymity" style="padding: 65px 26px 0;">
					<van-pull-refresh v-model="isLoading" @refresh="onRefresh">
						<home-list :anonymousData="anonymousData" v-if="isAnonymous"></home-list>
						<div class="list-img-pic" v-else>
							<nocontent></nocontent>
						</div>
					</van-pull-refresh>
				</div>
			
		</div>	
		
		
		<!-------------------------遮罩---------------------------------------------------->
		<div class="mask" v-if="isShow">
			<div class="mask-opaciy"></div>
			<div class="mask-information">
				<img :src="isfocusData.user_himg" class="head-portrait"/>
				<img src="../../assets/images/home/del.png" class="Close" @click="onClose"/>
				<h3>{{isfocusData.user_nickname}}</h3>
				<p>{{isfocusData.user_desc}}</p>
				<div class="info-follow">
					<div @click="onFollow">
						<img src="../../assets/images/home/follow.png"/>
						<span>{{value}}</span>
					</div>
					<img src="../../assets/images/hx.png"/>
					<div @click="onEmail">
						<img src="../../assets/images/home/letter.png"/>
						<span>发私信</span>
					</div>
				</div>
			</div>
		</div>
		<!--------------------------省市区---------------------------------------------->
		<div class="screen" v-if="isSearch">
			<div class="home-screen"></div>
			<div class="screen-con">
				<div class="plate-con">
					<p>请选择省</p>
					<ul>
						<li 
							v-for="(items,index) in provinceArr" 
							@click="provinceBack(index,items.cate_id)" 
							:class="index==provinceIndex?'active':''" 
							:id="items.cate_id"
						>{{items.cate_name}}</li>
					</ul>
				</div>
				<div class="plate-con">
					<p>请选择市</p>
					<ul>
						<li 
							v-for="(items,index) in cityArr" 
							@click="cityBack(index,items.cate_id)" 
							:class="index==cityIndex?'active':''" 
							:id="items.cate_id"
						>{{items.cate_name}}</li>
					</ul>
				</div>
				<div class="plate-con nomargin-bottom">
					<p>请选择圈子</p>
					<ul>
						<li 
							v-for="(items,index) in circleArr"
							@click="circleBack(index,items.cate_id)" 
							:class="index==circleIndex?'active':''" 
							:id="items.cate_id"
							>{{items.cate_name}}</li>
					</ul>
				</div>
				<div class="srceenBtn">
					<button @click="onReset" :class="isReset?'active-btn':''">重置</button>
					<button @click="onConfirm" :class="isBackgrue?'active-btn':''">确定</button>
				</div>
			</div>			
		</div>
	</div>
</template>

<script>
//	import TopNav from '@/components/commons/top-nav';
//	import TopBar from '@/components/home/top-bar';
	import HomeList from '@/components/home/home-list';
	import Nocontent from '@/components/home/no-content';
	import NoticePage from '@/components/home/notice-page';
	import axios from "axios";
	import qs from 'qs';
	import user from '@/utils/isLogin';
	import store from '@/vuex/store';
	import defalut from '@/assets/default.jpg';
	import { PullRefresh,Tab, Tabs} from 'vant';
	export default{
		data(){
			return{
//				currentView:"home.home",
				isHomeHome:true,
				isHomeAntonym:false,
				isHomeAntonymity:false,
				//顶部TAb
				currentCricle:{},
				isSearch:false,
				startAct:require('../../assets/images/home/start-act.png'),
				startDef:require('../../assets/images/home/start-def.png'),
//				currentRouter:"home.home",
				isClick:true,
				//首页
				fineData:{},
				newPostData:{},
				isLoading:true,
				isShow:false,
				isfocusData:{},
				value:'',
				userInfoId:'',
				userName:'',
				//实名
				//当前激活板块
				active:0,
				realanId:0,
				arrTab:{},
				realnameData:{},
				tabItemId:0,
				noticeData:{},
				moderaData:{},
				isfocusData:{},
				value:'',
				userInfoId:'',
				userName:'',
				defalut:defalut,
				handimg : '',
				//匿名
				anonymousData:{},
				//省市区
				provinceArr:{},
				cityArr:{},
				circleArr:{},
				provinceIndex:-1,
				cityIndex:-1,
				circleIndex:-1,
				circleID:'',//圈子id
				circleName:null,//获取圈子定时器
				timeTwo:null,//实名定时器
				timeNm:null,//匿名定时器
				timeJp:null,//精品定时器
				timeXt:null,//新帖
				isBackgrue:false,//确定圈子开关
				isReset:false,//重置开关,
				isFocus:true,//精品贴无数据开关
				isPosts:true,//新贴贴无数据开关
				isRealname:true,//实名无数据开关
				isAnonymous:true,//匿名无数据开关
				isNmemeda:true//实名标签点击
			}
		},
		store,
		components:{
//			TopNav,
//			TopBar
			HomeList,
			NoticePage,
			Nocontent,
			[PullRefresh.name]:PullRefresh,
			[Tab.name]:Tab, 
			[Tabs.name]:Tabs
		},
		filters: {
		  url: function (value) {
		    if (!value) return ''
		    value = user.src + value
		    return value
		  }
		},
		created(){
			//左上角圈子收藏
			var userInfo = JSON.parse(window.localStorage.getItem( 'userInfo' ));
			if(userInfo == undefined || userInfo == null){
				axios({
				   method: 'post',
				   url: user.src + '/index/Article/default_circle',
				})
				.then(res => {
					if(res.data.status == 200){
						this.currentCricle = res.data.data[0];
						var circleID = res.data.data[0].circle_circleId;
						this.circleID = res.data.data[0].circle_circleId;
						//新帖
						axios({
						   method: 'post',
						   url: user.src + '/index/Article/new_article_list',
						   data:{
						   	circleId:circleID
						   }
						})
						.then((res) => {
							if(res.data.status == 1007){
								this.isPosts = false;
							}
							if(res.data.status == 200){
								this.newPostData = res.data.data;
								this.isPosts = true;
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
						//--------------------------------精品贴------------------------------------
						axios({
						   method: 'post',
						   url: user.src + '/index/Article/goods_article_list',
						   data:{
						   	circleId:circleID
						   }
						})
						.then((res) => {
							if(res.data.status == 1006){
								this.isFocus = false;
							}
							if(res.data.status == 200){	
								this.fineData = res.data.data;
								this.isFocus = true;
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
						//---------------------匿名---------------------------------------
						axios({
						   method: 'post',
						   url: user.src + '/index/Article/anonymous_article',
						   data:{
						   	circleId:circleID
						   }
						})
						.then((res) => {
							
							if(res.data.status == 1014){
								this.isAnonymous = false;
							}
							if(res.data.status == 200){
								this.anonymousData = res.data.data;
								this.isAnonymous = true;
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
					}
				})
				.catch((error)=> {
				    console.log(error);
				});
			}else{
				var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
				var data = qs.stringify({
					userId:userId
				})
				axios({
				   method: 'post',
				   url: user.src + '/index/article/get_circlename',
				   data:data
				})
				.then(res => {
					//走默认
					if(res.data.status == 1072){
						axios({
						   method: 'post',
						   url: user.src + '/index/Article/default_circle',
						})
						.then(res => {
							if(res.data.status == 200){
								this.currentCricle = res.data.data[0];
								var circleID = res.data.data[0].circle_circleId;
								this.circleID = res.data.data[0].circle_circleId;
								var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
								axios.post( user.src + '/index/article/save_circle' , {
									userId:userId,
									circleId:circleID
								})
								.then((res) => {
									if(res.data.status == 1069){	
										
									}
								})
								.catch((error)=> {
								    console.log(error);
								});
								//新帖
								axios({
								   method: 'post',
								   url: user.src + '/index/Article/new_article_list',
								   data:{
								   	circleId:circleID
								   }
								})
								.then((res) => {
									if(res.data.status == 1007){
										this.isPosts = false;
									}
									if(res.data.status == 200){
										this.newPostData = res.data.data;
										this.isPosts = true;
									}
								})
								.catch((error)=> {
								    console.log(error);
								});
								//--------------------------------精品贴------------------------------------
								axios({
								   method: 'post',
								   url: user.src + '/index/Article/goods_article_list',
								   data:{
								   	circleId:circleID
								   }
								})
								.then((res) => {
									if(res.data.status == 1006){
										this.isFocus = false;
									}
									if(res.data.status == 200){
										this.fineData = res.data.data;
										this.isFocus = true;
									}
								})
								.catch((error)=> {
								    console.log(error);
								});
								//---------------------匿名---------------------------------------
								axios({
								   method: 'post',
								   url: user.src + '/index/Article/anonymous_article',
								   data:{
								   	circleId:circleID
								   }
								})
								.then((res) => {
									if(res.data.status == 1014){
										this.isAnonymous = false;
									}
									if(res.data.status == 200){
										this.anonymousData = res.data.data;
										this.isAnonymous = true;
									}
								})
								.catch((error)=> {
								    console.log(error);
								});
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
					}
					//走用户
					if(res.data.status == 1071){
						this.currentCricle = res.data.data[0];
						this.circleID = res.data.data[0].circle_circleId;
						var circleID = res.data.data[0].circle_circleId;
						//新帖
						axios({
						   method: 'post',
						   url: user.src + '/index/Article/new_article_list',
						   data:{
						   	circleId:circleID
						   }
						})
						.then((res) => {
							if(res.data.status == 1007){
								this.isPosts = false;
							}
							if(res.data.status == 200){
								this.newPostData = res.data.data;
								this.isPosts = true;
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
						//--------------------------------精品贴------------------------------------
						axios({
						   method: 'post',
						   url: user.src + '/index/Article/goods_article_list',
						   data:{
						   	circleId:circleID
						   }
						})
						.then((res) => {
							if(res.data.status == 1006){
								this.isFocus = false;
							}
							if(res.data.status == 200){
								this.fineData = res.data.data;
								this.isFocus = true;
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
						//---------------------匿名---------------------------------------
						axios({
						   method: 'post',
						   url: user.src + '/index/Article/anonymous_article',
						   data:{
						   	circleId:circleID
						   }
						})
						.then((res) => {
							if(res.data.status == 1014){
								this.isAnonymous = false;
							}
							if(res.data.status == 200){
								this.anonymousData = res.data.data;
								this.isAnonymous = true;
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
					}
				})
				.catch((error)=> {
				    console.log(error);
				});
				setInterval(()=>{
					var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
					var data = qs.stringify({
						userId:userId
					})
					axios({
					   method: 'post',
					   url: user.src + '/index/article/get_circlename',
					   data:data
					})
					.then(res => {
						if(res.data.status == 1071){
							this.currentCricle = res.data.data[0];
						}
					})
				},1000)
			}
			
			
			//--------------------------------精品贴------------------------------------
//			axios({
//			   method: 'post',
//			   url: user.src + '/index/Article/goods_article_list',
//			   data:{
//			   	circleId:this.circleID
//			   }
//			})
//			.then((res) => {
//				if(res.data.status == 1006){
//					this.isConatu = false;
//				}
//				if(res.data.status == 200){
//					this.isConatu = true;
//					this.fineData = res.data.data;
//				}
//			})
//			.catch((error)=> {
//				alert(error)
//			    console.log(error);
//			});
			
			//---------------------------------------新帖------------------------------------
//			axios({
//			   method: 'post',
//			   url: user.src + '/index/Article/new_article_list',
//			   data:{
//			   	circleId:this.circleID
//			   }
//			})
//			.then((res) => {
//				if(res.data.status == 200){
//					this.newPostData = res.data.data;
//				}
//			})
//			.catch((error)=> {
//			    console.log(error);
//			});		
			//---------------------------实名----------------------------------------
//			var userInfo = JSON.parse(window.localStorage.getItem( 'userInfo' ));
			if(userInfo == undefined || userInfo == null){
//				return;
			}else{
				var userid = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
				var data = qs.stringify({
					uid:userid
				})
				axios({
				   method: 'POST',
				   url: user.src + '/index/Article/real_name_article',
				   data:data
				})
				.then((res) => {
					if(res.data.status == 1013){
						this.isRealname = false;
					}
					if(res.data.status == 200){	
						this.arrTab = res.data.data.cate;
						this.realnameData = res.data.data.data;
//						this.moderaData = res.data.data.data[0].user;
//						this.handimg = this.moderaData.user_himg;
						this.isRealname = true;
					}
				})
				.catch((error) => {
				    console.log(error);
				})
			}
			//--------------------------匿名----------------------------------
			
//			axios({
//			   method: 'post',
//			   url: user.src + '/index/Article/anonymous_article',
//			   data:{
//			   	circleId:this.circleID
//			   }
//			})
//			.then((res) => {
//				if(res.data.status == 200){
//					this.anonymousData = res.data.data;
//				}
//			})
//			.catch((error)=> {
//			    console.log(error);
//			});
			
			
			
			
			
			//_________________________________________定时器更新_________________________________________________________
			
			//圈子定时器更新
			this.circleName = function(){
				var time1 = null;
				time1 = setInterval(()=>{
					var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
					var data = qs.stringify({
						userId:userId
					})
					axios({
					   method: 'post',
					   url: user.src + '/index/article/get_circlename',
					   data:data
					})
					.then(res => {
						if(res.data.status == 1072){
							clearInterval(time1)
						}
						if(res.data.status == 1071){
							this.currentCricle = res.data.data[0];
							this.CricleId = res.data.data[0].circle_circleId;
							clearInterval(time1)
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
				},500)
			}
			
			//实名定时器更新
			this.timeTwo = function(){
				var time2 = null;
				time2 = setInterval(()=>{
					var userid = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
					var data = qs.stringify({
						uid:userid,
					})
					//-------------------------实名---------------------------
					axios({
					   method: 'POST',
					   url: user.src + '/index/Article/real_name_article',
					   data:data
					})
					.then((res) => {
						if(res.data.status == 1013){
							this.isRealname = false;
							clearInterval(time2);
						}
						if(res.data.status == 200){	
							this.arrTab = res.data.data.cate;
							this.realnameData = res.data.data.data;
							this.moderaData = res.data.data.data[0].user;
							this.handimg = this.moderaData.user_himg;
							this.isRealname = true;
							clearInterval(time2);
						}
					})
					.catch((error) => {
					    console.log(error);
					})
					
				},500)
			}
			//精品定时器更新
			this.timeJp = function(){
				var time3 = null;
				time3 = setInterval(()=>{
					axios({
					   method: 'post',
					   url: user.src + '/index/Article/goods_article_list',
					   data:{
					   	circleId:this.circleID
					   }
					})
					.then((res) => {
						if(res.data.status == 1006){
							this.isFocus = false;
							clearInterval(time3);
						}
						if(res.data.status == 200){
							this.fineData = res.data.data;
							this.isFocus = true;
							clearInterval(time3);
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
				},500)
			}
			//新帖定时器更新
			this.timeXt = function(){
				var time4 = null;
				time4 = setInterval(()=>{
					axios({
					   method: 'post',
					   url: user.src + '/index/Article/new_article_list',
					   data:{
					   	circleId:this.circleID
					   }
					})
					.then((res) => {
						if(res.data.status == 1007){
							this.isPosts = false;
							clearInterval(time4);
						}
						if(res.data.status == 200){
							this.newPostData = res.data.data;
							this.isPosts = true;
							clearInterval(time4);
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
				},500)
			}
			//匿名定时器更新
			this.timeNm = function(){
				var time5 = null;
				time5 = setInterval(()=>{
					axios({
					   method: 'post',
					   url: user.src + '/index/Article/anonymous_article',
					   data:{
					   	circleId:this.circleID
					   }
					})
					.then((res) => {
						if(res.data.status == 1014){
							this.isAnonymous = false;
							clearInterval(time5);
						}
						if(res.data.status == 200){
							this.anonymousData = res.data.data;
							this.isAnonymous = true;
							clearInterval(time5);
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
				},500)
			}
			//公告
			axios.post( user.src + '/index/plate/announcement_list' , {})
			.then((res) => {
				if(res.data.status == 200){
					this.noticeData = res.data.data;
				}
			})
			.catch((error)=> {
			    console.log(error);
			});
	
			
			//-------------------省市区-------------------------------
			//省
			axios({
			   method: 'post',
			   url: user.src + '/index/plate/provincial_list'
			})
			.then((res) => {
				if(res.data.status == 200){
					var cityId = res.data.data[0].cate_id;
					this.provinceArr = res.data.data;
					//市
					var data = qs.stringify({
						cate_id:cityId
					})
					axios({
					   method: 'post',
					   url: user.src + '/index/plate/city_list',
					   data:data
					})
					.then((res) => {
						if(res.data.status == 200){
							var circleId = res.data.data[0].cate_id;
							this.cityArr = res.data.data;
							//圈
							var data = qs.stringify({
								city_id:circleId
							})
							axios({
							   method: 'post',
							   url: user.src + '/index/plate/circle_list',
							   data:data
							})
							.then((res) => {
								if(res.data.status == 200){
									this.circleArr = res.data.data;
								}
							})
							.catch((error)=> {
							    console.log(error);
							});
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
				}
			})
			.catch((error)=> {
			    console.log(error);
			});
			
			function plusReady(){
				// 监听点击消息事件
			   plus.push.addEventListener("click", function(msg) {
//					var payload=(plus.os.name=='iOS')?msg.payload:JSON.parse(msg.payload);
					pushGetRun(msg);
				}, false);
				function pushGetRun(payload) {
					plus.push.clear();
					var msg = payload;
					var msgId = msg.payload.id;
					if(msgId == '1'){
						var notice = plus.webview.create('notice.html','notice',{},{});
						notice.addEventListener("loaded", ()=>{
						    notice.show('fade-in', 150);
						    notice = null;
						}, false);
					}else if(msgId=='2'){
						var reply = plus.webview.create('reply.html','reply',{},{});
						reply.addEventListener("loaded", ()=>{
						    reply.show('fade-in', 150);
						    reply = null;
						}, false);
					}else if(msgId=='3'){
						var thumbsup = plus.webview.create('thumbsup.html','thumbsup',{},{});
						thumbsup.addEventListener("loaded", ()=>{
						    thumbsup.show('fade-in', 150);
						    thumbsup = null;
						}, false);
					}else if(msgId=='4'){
						var privates = plus.webview.create('privates.html','privates',{},{});
						privates.addEventListener("loaded", ()=>{
						    privates.show('fade-in', 150);
						    privates = null;
						}, false);
					}
				};
				// 监听在线消息事件
				plus.push.addEventListener("receive", function(msg) {
					
				}, false);
//				let cw = plus.webview.currentWebview();
//				cw.addEventListener('loaded',this.preLoad(cw))
//				cw.addEventListener('show',()=>{
//					let hIndex = plus.webview.getWebviewById(this.currentView);
//			      	hIndex.show();
//				})
			}
			if (window.plus) {
		      plusReady();
		   } else {
		      document.addEventListener("plusready", plusReady, false);
		   }
		},
		methods:{
			//开启筛选
			filtCricle(){
				var userInfo = JSON.parse(window.localStorage.getItem( 'userInfo' ));
				if(userInfo == undefined || userInfo == null){
					if(this.isClick){
						this.isClick = false;
						var login = plus.webview.create('login.html','login',{},{});
						login.addEventListener("loaded", ()=> {
						    login.show('pop-in', 300);
						    this.isClick = true;
						    login = null;
						}, false);
					}
				}else{
					this.isSearch = !this.isSearch;
				}			
			},
			//切换收藏
			change(id){
				var userInfo = JSON.parse(window.localStorage.getItem( 'userInfo' ));
				if(userInfo == undefined || userInfo == null|| userInfo == 'null'){
					if(this.isClick){
						this.isClick = false;
						var login = plus.webview.create('login.html','login',{},{});
						login.addEventListener("loaded", ()=> {
						    login.show('pop-in', 300);
						    this.isClick = true;
						    login = null;
						}, false);
					}
				}else{
					var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
					if(userId){
						axios.post( user.src + '/index/collect/collect' , {
							userid:userId,
							circle_id:id
						})
						.then((res) => {
							if(res.data.status == 2001){
								plus.nativeUI.toast("收藏成功");
								var data = qs.stringify({
									userId:userId
								})
								axios({
								   method: 'post',
								   url: user.src + '/index/article/get_circlename',
								   data:data
								})
								.then(res => {
									if(res.data.status == 1071){
										this.currentCricle = res.data.data[0];
									}
								})
								.catch((error)=> {
								    console.log(error);
								});
								plus.webview.getWebviewById('collect').reload();	
							}
							if(res.data.status == 1005){
								plus.nativeUI.toast("取消收藏");
								var data = qs.stringify({
									userId:userId
								})
								axios({
								   method: 'post',
								   url: user.src + '/index/article/get_circlename',
								   data:data
								})
								.then(res => {
									if(res.data.status == 1071){
										this.collect = res.data.data.collect;
										this.currentCricle = res.data.data[0];
									}
								})
								.catch((error)=> {
								    console.log(error);
								});
								plus.webview.getWebviewById('collect').reload();
								
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
					}
				}	
			},
			//首页点击
			onHomeHome(){
				if(this.isSearch){
					return;
				}else{
					this.isHomeHome = true;
					this.isHomeAntonym = false;
					this.isHomeAntonymity = false;
				}
			},
			//实名点击
			onHomeAuton(){
				var userInfo = JSON.parse(window.localStorage.getItem( 'userInfo' ));
				if(userInfo == undefined || userInfo == null){
					if(this.isClick){
						this.isClick = false;
						var login = plus.webview.create('login.html','login',{},{});
						login.addEventListener("loaded", ()=> {
						   login.show('pop-in', 300);
						   this.isClick = true;
						   login = null;
						}, false);
					}
				}else{
					if(JSON.stringify(this.currentCricle.circle_circleId) == undefined){
						plus.nativeUI.toast("请先在右上角选择圈子");
						return;
					}
					if(this.isSearch){
						return;
					}else{
						this.isHomeHome = false;
						this.isHomeAntonym = true;
						this.isHomeAntonymity = false;
					}
				}
			},
			//匿名点击
			onHomeAntonymity(){
				var userInfo = JSON.parse(window.localStorage.getItem( 'userInfo' ));
				if(userInfo == undefined || userInfo == null){
					if(this.isClick){
						this.isClick = false;
						var login = plus.webview.create('login.html','login',{},{});
						login.addEventListener("loaded", ()=> {
						   login.show('pop-in', 300);
						   this.isClick = true;
						   login = null;
						}, false);
					}
				}else{
					if(this.isSearch){
						return;
					}else{
						this.isHomeHome = false;
						this.isHomeAntonym = false;
						this.isHomeAntonymity = true;
					}
				}
			},
			//接受子组件数据
			maskEfocus(arr){
				this.isfocusData = arr[0];
				this.isShow = arr[1];
				this.userInfoId = arr[2];
				this.userName = arr[3];
				this.value = arr[4];
			},
			//关闭窗口
			onClose(){
				this.isShow = false;
			},
			//关注
			onFollow(){
				var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
				var data = qs.stringify({
			   	article_userId:this.userInfoId,
			   	userid:userId
				})
				axios({
				   method: 'post',
				   url: user.src + '/index/collect/focus',
				   data:data
				})
				.then((res) => {
					if(res.data.status == 200){
						this.value = '已关注';
						plus.nativeUI.toast("关注成功");
					}else if(res.data.status == 1030){
						this.value = '关注';
						plus.nativeUI.toast("取消关注");
					}
				})
				.catch((error)=> {
				    console.log(error);
				});
			},
			//私信
			onEmail(){
				var send = plus.webview.create('send.html','send',{},{
					recipientId:this.userInfoId,
					name:this.userName
				});
				send.addEventListener("loaded", function () {
				    send.show('slide-in-right', 300);
				    send = null;
				}, false);
				this.isShow = false;
			},
			//首页下拉刷新
			onRefresh(){
		      setTimeout(() => {
		        	axios({
					   method: 'post',
					   url: user.src + '/index/Article/goods_article_list',
					   data:{
					   	circleId:this.circleID
					   }
					})
					.then((res) => {
						if(res.data.status == 1006){
							this.isFocus = false;
						}
						if(res.data.status == 200){
							this.fineData = res.data.data;
							this.isFocus = true;
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
					//新帖
					axios({
					   method: 'post',
					   url: user.src + '/index/Article/new_article_list',
					   data:{
					   	circleId:this.circleID
					   }
					})
					.then((res) => {
						if(res.data.status == 1007){
							this.isPosts = false;
						}
						if(res.data.status == 200){
							this.newPostData = res.data.data;
							this.isPosts = true;
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
					//实名
//					var userInfo = JSON.parse(window.localStorage.getItem( 'userInfo' ));
//					if(userInfo == undefined || userInfo == null){
//						this.isLoading = false;
//					}else{
//						var userid = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
//						var data = qs.stringify({
//							uid:userid,
//						})
//						axios({
//						   method: 'POST',
//						   url: user.src + '/index/Article/real_name_article',
//						   data:data
//						})
//						.then((res) => {
//							if(res.data.status == 1013){
//								this.isRealname = false;
//							}
//							if(res.data.status == 200){	
//								this.active = 0;
//								this.arrTab = res.data.data.cate;
//								this.realnameData = res.data.data.data;
//								this.moderaData = res.data.data.data[0].user;
//								this.handimg = this.moderaData.user_himg;
//								this.isRealname = true;
//							}
//						})
//						.catch((error) => {
//						    console.log(error);
//						})
//					}
					//匿名
					axios({
					   method: 'post',
					   url: user.src + '/index/Article/anonymous_article',
					   data:{
					   	circleId:this.circleID
					   }
					})
					.then((res) => {
						if(res.data.status == 1014){
							this.isAnonymous = false;
						}
						if(res.data.status == 200){
							this.anonymousData = res.data.data;
							this.isAnonymous = true;
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
		        	this.isLoading = false;
		      }, 1500); 
		   },
		   //实名TAB
		   onTabs(ind){
				this.arrTab.forEach((items,index)=>{
					if(ind == index){
						this.tabItemId = items.cate_id;
					}
				})
				var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
				if(ind == 0){
					var data = qs.stringify({
						uid:userId
					})
					axios({
					   method: 'POST',
					   url: user.src + '/index/Article/real_name_article',
					   data:data
					})
					.then((res) => {
						if(res.data.status == 1013){
							this.isRealname = false;
						}
						console.log(JSON.stringify(res))
						if(res.data.status == 200){	
							this.arrTab = res.data.data.cate;
							this.realnameData = res.data.data.data;
//							this.moderaData = res.data.data.data[0].user;
//							this.handimg = this.moderaData.user_himg;
							this.isRealname = true;
						}
					})
					.catch((error) => {
					    console.log(error);
					})
				}else{
					axios({
					   method: 'post',
					   url: user.src + '/index/Article/real_name_article',
					   data: {
						   uid:userId,
						   atype:this.tabItemId
					  	}
					})
					.then(res => {
						if(res.data.status == 1013){
							this.isNmemeda = false;
						}
						if(res.data.status == 200){
							this.realnameData = res.data.data.data;
							this.isNmemeda = true;
						}
					})
					.catch(error => {
					    console.log(error);
					})
				}
				
				
			},
		   //----------------------省市区------------------------------
		   //省改变背景
			provinceBack(index,id){
		      this.provinceIndex = index;
		      var data = qs.stringify({
					cate_id:id
				})
				axios({
				   method: 'post',
				   url: user.src + '/index/plate/city_list',
				   data:data
				})
				.then((res) => {
					if(res.data.status == 200){
						var circleId = res.data.data[0].cate_id;
						this.cityArr = res.data.data;
						//圈
						var data = qs.stringify({
							city_id:circleId
						})
						axios({
						   method: 'post',
						   url: user.src + '/index/plate/circle_list',
						   data:data
						})
						.then((res) => {
							if(res.status == 200){
								this.circleArr = res.data.data;
							}
						})
						.catch((error)=> {
						    console.log(error);
						});
					}
				})
				.catch((error)=> {
				    console.log(error);
				});
				this.cityIndex = -1;
				this.circleIndex = -1;
		   },
			//市改变背景
			cityBack(index,id){
				this.cityIndex = index;
				var data = qs.stringify({
					city_id:id
				})
				axios({
				   method: 'post',
				   url: user.src + '/index/plate/circle_list',
				   data:data
				})
				.then((res) => {
					if(res.data.status == 200){
						this.circleArr = res.data.data;
					}
				})
				.catch((error)=> {
				    console.log(error);
				});
			},
			//圈子改变背景
			circleBack(index,id){
				this.circleID = id;
				this.circleIndex = index;
			},
			//重置圈子
			onReset(){
				this.isReset = true;
				this.provinceIndex = -1;
				this.cityIndex = -1;
				this.circleIndex = -1;
				this.circleID = '';
				setTimeout(()=>{
					this.isReset = false;
				},200)
			},
			//选择圈子确定
			onConfirm(){
				if(this.circleIndex == -1){
					plus.nativeUI.toast('请选择圈子~')
				}else{
					this.isBackgrue = true;
					var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
					axios.post( user.src + '/index/article/save_circle' , {
						userId:userId,
						circleId:this.circleID
					})
					.then((res) => {
						if(res.data.status == 1069){	
							this.circleName();
							this.timeTwo();
							this.timeXt();
							this.timeJp();
							this.timeNm();
							this.isSearch = false;
							this.isBackgrue = false;
						}
					})
					.catch((error)=> {
					    console.log(error);
					});
				}
			},
			//跳转更多
			onBoutique(){
				if(this.isClick){
					this.isClick = false;
					var boutique = plus.webview.create('boutique.html','boutique',{scrollIndicator:'none'},{});
					boutique.addEventListener("loaded", ()=> {
					    boutique.show('pop-in', 300);
					    this.isClick = true;
					    boutique = null;
					}, false);
				}
			}	
			//预加载首页子路由
//			preLoad(cw){
//				const rem = cw.rem;
//			  	const pageBottom = rem*3.125;
//			  	const pageTop = rem*4.0625;
//				let preWebView = [
//			      {
//			      	id:'home.home',
//			      	url:'./home.home.html'
//			      },
//			      {
//			      	id:'home.autonym',
//			      	url:'./home.autonym.html'
//			      },
//			      {
//			      	id:'home.anonymity',
//			      	url:'./home.anonymity.html'
//			      }
//		      	];
//		      	preWebView.map((webview)=>{
//		      	plus.webview.create(
//		      		webview.url,
//		      		webview.id,
//		      		{
//				  		top:pageTop,
//				  		bottom:pageBottom,
//				  		popGesture:'hide',
//				  		render:'always',
//				  	},
//				  	{
//				  		routerView:true,
//				  		rem:rem
//				  	}
//		      	)
//		      	let hIndex = plus.webview.getWebviewById(this.currentView);
//		      	hIndex.addEventListener('rendered',function(){
//		      		hIndex.show();
//		      		plus.navigator.closeSplashscreen();
//		      	})
//		      })
//			},
			//路由切换
//			routerChange(detail){
//				if(this.currentView === detail.path){
//					return false;
//				}
//				let newview = plus.webview.getWebviewById(detail.path),
//					oldview = plus.webview.getWebviewById(this.currentView);
//				oldview.hide();
//				this.currentView = detail.path;
//				newview.show();
//			}
		}
	}
</script>
<style lang="less">
	*{
		margin: 0;
		padding: 0;
	}
	ul,li{
		list-style: none;
	}
	.nav{
		position: fixed;
		top: 0;
		left: 0;
		z-index: 100;
		width: 100%;
		height: 130px;
		background:@default-blue;
		box-shadow: 0px 0px 8px 1px #999;
	}
	.title{
		display: inline-block;
		color: #fff;
		font-size: 34px;
		width: 100%;
		text-align: center;
		height: 90px;
		margin-top: 40px;
		line-height: 90px;
	}
	/*顶部*/
	.wrap{
		width: 100%;
		height: 90px;
		padding-top:40px;
		display: flex;
		align-items: center;
		color: #fff;
		&>div{
			height: 90px;
			display: flex;
			align-items: center;
		}
		.cricle-item{
			width: 175px;
			justify-content: center;
			span{
				font-size: 30px;
				font-weight: 300;
			}
			img{
				width: 30px;
				height: 30px;
			}
		}
		.router-item{
			width: 465px;
			padding:0 125px 0 60px;
			box-sizing: border-box;
			justify-content: space-between;
			.item{
				width: 88px;
				height: 55px;
				color: #fff;
				font-size: 36px;
				font-weight: 400;
				position: relative;
				text-align:center;
			}
			.action{
				font-weight: 600;
			}
			.action::after{
				content: "";
				width: 56px;
				height: 4px;
				border-radius: 2px;
				background: #fff;
				position: absolute;
				bottom: -2px;
				left:0;
				right: 0;
				margin: auto;
				display: block;
			}
		}
		.select-item{
			width: 110px;
			justify-content: center;
			img{
				width: 55px;
				height: 55px;
				transition:0.1s;
			}
			.default{
				transform: rotateZ(45deg);
			}
			.action{
				transform: rotateZ(0);
			}
		}
	}	
	/*--------------首页------------------------*/	
	.home_home{
		height:100%;
		/*padding-top: 130px;*/
	}
	.home{
		overflow: hidden;
		/*height: 734px;*/
		border-bottom: 1.2rem solid #ededed;
		padding: 0 26px 0 25px;
	}
	.home-title{
		height: 78px;
		border-bottom: 0.1rem solid #ededed;
		display: flex;
		justify-content: space-between;
	}
	.home-title h3{
		height: 38px;
		padding-left: 10px;
		margin-top: 25px;
		border-left: 0.rem solid #00a1ff;
		line-height: 38px;
		font-size: 30px;
		color: #000;
	}
	.home-title span{
		font-size: 24px;
		color: #9c9c9c;
		margin-top: 32px;
	}
	.list-height{
		height: 656px;
	}
	.list-img-pic{
		height: 656px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.home-bottom{
		border-bottom: 0;
	}
	.home-title .color{
		border-color: #ff801c;
	}
	.van-pull-refresh__loading{
		font-size: 26px !important;
	}
	.van-pull-refresh__text{
		font-size: 26px !important;
	}
	/*------------------实名------------------------------*/
	.home_autonym{
		padding-top: 130px;
	}
	.van-tabs__wrap{
		height: 70px !important;
		position: fixed;
		top: 130px;
		z-index: 0;
	}
	.van-tab{
		width: 80px !important;
		line-height: 70px !important;
		font-size: 26px !important;
		font-weight: 600 !important; 
		color: #666 !important;
	}
	.van-tab__pane{
		margin-top: 25px;
		box-sizing: border-box;
	}
	.van-tabs__line{
		background-color: #00A2FF !important;
		height: 4px;
	}
	.van-tab--active{
		color: #00A2FF !important;
	}
	.moderator{
		overflow: hidden;
		background: #f4f4f4;
		padding: 11px 33px 11px 19px;
		.modera-name{
			background: #FFFFFF;
			overflow: hidden;
			img{
				width: 130px;
				height: 115px;
				float: left;
				margin-right: 24px;
			}
			p{
				line-height:115px;
				font-size: 24px;
				span{
					color: #00a8ff;
					margin-left: 14px;
				}
			}
		}
	}
	.home-content{
		/*background: red;*/
		padding-left: 19px;
		padding-right: 33px;
		overflow: hidden;
		.notice{
			height: 92px;
			border-bottom: 0.1rem solid #bbb;
			padding-top: 18px;
			p{
				font-size: 26px;
				line-height: 26px;
				margin-bottom: 20px;
				span{
					color: #c1585c;
				}
			}
		}
	}
	/*-----------------匿名-----------------------*/
	.home_autonymity{
		padding: 130px 26px 0;
	}
	/*-----------------遮罩------------------------*/
	.mask{
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0;
		top: 0;
		.mask-opaciy{
			width: 100%;
			height: 100%;
			background: #000000;
			opacity: .5;
		}
		.mask-information{
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			margin: auto;
			width: 598px;
			height: 467px;
			border: 0.1rem solid #d4ccca;
			background: #FFFFFF;
			border-radius: 10px;
			.head-portrait{
				position: absolute;
				left: 212px;
				top: -70px;
				width: 160px;
				height: 160px;
				border: 0.2rem solid #FFFFFF;
				border-radius: 50%;
			}
			.Close{
				position: absolute;
				right: 0;
				top: -80px;
				width:76px;
				height: 76px;
			}
			h3{
				height: 60px;
				margin-top: 120px;
				text-align: center;
				font-size: 38px;
			}
			p{
				height: 147px;
				margin-top: 10px;
				padding: 0 80px;
				font-size: 26px;
				overflow: hidden;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 3;
				overflow: hidden;
			}
			.info-follow{
				height: 128px;
				border-top: 0.1rem solid #cecece;
				display: flex;
				align-items: center;	
				justify-content: space-between;			
				padding-left: 90px;
				padding-right: 75px;
				div{
					display: flex;
					align-items: center;
					img{
						width: 48px;
						height: 46px;
						margin-right: 10px;
					}
					span{
						font-size: 28px;
					}
				}
				img{
					width: 1px;
					height: 43px;
				}
				
			}
		}
	}
	/*------------省市区------------------------*/
	.screen{
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 10;
	}
	.home-screen{
		width: 100%;
		height: 100%;
		background: #000;
		opacity: .5;
	}
	.screen-con{
		width: 100%;
		background: #f3f1f4;
		position: absolute;
		left: 0;
		top: 126px;
		.srceenBtn{
			width: 100%;
			height: 84px;
			border-top: 0.1rem solid #d8d8d8;
			border-bottom: 0.1rem solid #d8d8d8;
			button{
				width: 50%;
				height: 100%;
				border: 0;
				float: left;
				outline:none;
				font-size: 28px;
				background: #fff;
				color: #00a2ff;
				border-right: 1px solid #d8d8d8;
			}

			.active-btn{
				background: #00a2ff;
				color:#fff;
			}
		}
	}
	.plate-con{
		margin-bottom: 10px;
		padding-top: 20px;
		background: #fff;
		p{
			padding-left: 27px;
			font-size: 28px;
			margin-bottom: 38px;
		}
		ul{
			overflow: hidden;
			padding-left: 56px;
			padding-right: 44px;
			li{
				float: left;
				width: 128px;
				height: 48px;
				text-align: center;
				border: 0.1rem solid #ebebeb;
				font-size: 26px;
				line-height: 50px;
				margin-bottom: 30px;
				border-radius: 50px;
				margin-right: 30px;
			}
			li:nth-child(4n){
				margin-right: 0;
			}
		}
	}
	.nomargin-bottom{
		margin-bottom: 0;
	}
	.active{
		background: #00a2ff;
		color:#fff;
	}
</style>